  <template>
	<view class="zai-box">
        <scroll-view scroll-y class="page">
            <view class="text-center" :style="[{animation: 'show ' + 0.4+ 's 1'}]">
				<image src="https://www.suzi-info.com/applogin.png" mode='aspectFit' class="zai-logo "></image>
				<view class="zai-title text-shadow ">{{domainNamecomp?domainNamecomp:domainNamecompS}}</view>
			</view>
            <view class="box padding-lr-xl login-paddingtop" :style="[{animation: 'show ' + 0.6+ 's 1'}]">
				<block v-if="loginWay==1">
					<view class="cu-form-group margin-top  shadow-warp" :class="[shape=='round'?'round':'']">
						<view class="title"><text class="cuIcon-people margin-right-xs"></text>账号:</view>
						<input placeholder="请输入账号" name="input" v-model="userName"></input>
					</view>
					<view class="cu-form-group margin-top shadow-warp" :class="[shape=='round'?'round':'']">
						<view class="title"><text class="cuIcon-lock margin-right-xs"></text>密码:</view>
						<input class="uni-input" placeholder="请输入密码" :password="!showPassword" v-model="password" />
						<view class="action text-lg">
						    <text :class="[showPassword ? 'cuIcon-attention' : 'cuIcon-attentionforbid']" @click="changePassword"></text>
						</view>
					</view>
					<view class="padding text-center margin-top">
						<button class="cu-btn bg-blue lg margin-right shadow" :loading="loading" :class="[shape=='round'?'round':'']"
							@tap="onLogin"><text space="emsp">{{loading ? "登录中...":" 登录 "}}</text>
						</button>
					</view>
				</block>
                <block v-else>
                	<view class="cu-form-group margin-top  shadow-warp" :class="[shape=='round'?'round':'']">
                		<view class="title"><text class="cuIcon-mobile margin-right-xs"></text>手机号:</view>
                		<input placeholder="请输入手机号" type="number" maxlength="11" v-model="phoneNo"></input>
                	</view>
                	<view class="cu-form-group margin-top shadow-warp" :class="[shape=='round'?'round':'']">
                		<view class="title"><text class="cuIcon-lock margin-right-xs"></text>验证码:</view>
                		<input class="uni-input" placeholder="请输入验证码" v-model="smsCode"/>
                		<view class="action">
                			<button class="cu-btn line-blue sm" :disabled="!isSendSMSEnable" @click="onSMSSend"> {{ getSendBtnText }}</button>
                		</view>
                	</view>
                	<view class="padding text-center margin-top">
                		<button class="cu-btn bg-blue lg margin-right shadow" :loading="loading" :class="[shape=='round'?'round':'']"
                			@tap="onSMSLogin"><text space="emsp">{{loading ? "登录中...":" 登录 "}}</text>
                		</button>
                		<button class="cu-btn line-blue lg margin-left shadow" :disabled="true" :loading="loading" :class="[shape=='round'?'round':'']"
                			@tap="loginWay=1">账户登录
                		</button>
                	</view>
                </block>		
	
				<!-- #ifdef APP-PLUS -->
				<view class="padding flex flex-direction  text-center">
					当前版本:{{version}}
				</view>
				<!-- #endif -->
				
            </view>
        </scroll-view>
		<!-- 登录加载弹窗 -->
		<view class="cu-load load-modal" v-if="loading">
			<!-- <view class="cuIcon-emojifill text-orange"></view> -->
			<image src="https://static.jeecg.com/upload/test/login4_1595818039175.png" mode="aspectFit" class="round"></image>
			<view class="gray-text">登录中...</view>
		</view>
    </view>

</template>

<script>
	import { ACCESS_TOKEN,USER_NAME,USER_INFO,SASS_TENANT_ID,EMPLOYEE_INFO,SASS_DOMAIN_ID,SASS_DOMAIN_NAME} from "@/common/util/constants"
	import { mapActions } from "vuex"
    import configService from '@/common/service/config.service.js';
	
    export default {
        data() {
            return {
				shape:'',//round 圆形
				loading: false,
				userName: 'user@domain',
				password: '',
				phoneNo: '',
				smsCode: '',
				loginParams:{},
				domainName:'',
				domainNamecomp:'',
				domainNamecompS: '',
				domainid:'',
				oldDomainid: '',
				showPassword: false, //是否显示明文
				loginWay: 1, //1: 账密，2：验证码
				smsCountDown: 0,
				smsCountInterval: null,
				toggleDelay: false,
				version:'',
				unionId : '',
				openid : '',
				//第三方登录相关信息
				thirdType:"",
				thirdLoginInfo:"",
				thirdLoginState:false,
				bindingPhoneModal:false,
				thirdUserUuid:'',
				url: {
					bindingThirdPhone: '/sys/thirdLogin/bindingThirdPhone'
				}
            };
        },
		onLoad:function(){
			// #ifdef APP-PLUS
			var that=this
			plus.runtime.getProperty( plus.runtime.appid, function ( wgtinfo ) {
				that.version=wgtinfo.version
			});
			// #endif
		},
		computed: {
		      isSendSMSEnable() {
		        return this.smsCountDown <= 0 && this.phoneNo.length > 4;
		      },
		      getSendBtnText() {
		        if (this.smsCountDown > 0) {
		          return this.smsCountDown + '秒后发送';
		        } else {
		          return '发送验证码';
		        }
		      },
		      canSMSLogin() {
		        return this.userName.length > 4 && this.smsCode.length > 4;
		      },
		      canPwdLogin() {
		        return this.userName.length > 4 && this.password.length > 4;
		      },
		},
		created() {
			let domain =  this.getDomainStorage() ? this.getDomainStorage() : 'domain'
			this.domainid = this.getDomainStorage() ? this.getDomainStorage() : ''
			console.log(domain)
			console.log(this.domainid)
			this.userName =  'user@' + domain
			this.domainNamecomp = uni.getStorageSync(SASS_DOMAIN_NAME)
			console.log("page active....",this.domainNamecomp)
			this.initFireWall()
			this.getSaasDomainByXcx1()
			// this.onWxLogin()

		},
        methods: {
			initFireWall(){
			  return new Promise((resolve, reject) => {
				  let _domainId = ''
			      uni.request({
			        url: 'http://xutest.suzi-info.com:8089/api/auth/verifyapp',
			        method: 'GET',
			        data:{
						companyId: _domainId || 'zhangtest',
						authCode: '333666999'
				    },
			        header:  {
			          'Content-Type': 'application/json'
			        },
			        success: (res) => {
					  console.log(res)
					  this.$tip.toast(res);
			          resolve(res.data)
			        },
			        fail: (err) => {
					  console.log(err)
					  this.$tip.toast(err);
			          reject(err)
			        }
			      })
			    })			  
			},
			//获取域名
			getDomainStorage() {
				let domain = ''
				try{
					domain = uni.getStorageSync(SASS_DOMAIN_ID)					
					console.log("getDomainStorage ok",domain)
				}catch(e){
					//TODO handle the exception
					console.log("getDomainStorage",domain)
				}
				return domain
			},
			 ...mapActions([ "mLogin","PhoneLogin","xcxLogin","ThirdLogin" ]),
			 
			 //用户登入，用小程序登入替代。
			// onLogin: function (){
			//         if(!this.userName || this.userName.length==0){
			//           this.$tip.toast('请填写用户名');
			//           return;
			//         }
			//         if(!this.password || this.password.length==0){
			//            this.$tip.toast('请填写密码');
			//           return;
			//         }

			// 		let domainPrefix = this.userName.split("@")[1]
			// 		this.loginParams = {
			// 		  username: this.userName.split("@")[0],
			// 		  password:this.password
			// 		}
			// 		if (domainPrefix)  {
			// 			this.domainName = domainPrefix + ".suzi-info.com"
			// 			this.getSaasDomain()
			// 		} else {
			// 			this.$tip.toast('用户名格式不对！（例：username@domian）');
			// 			return;
			// 		}	
			// },
			//0.登入开始。
			onLogin: function (){
					// if (this.userName && this.userName == "user@domain"){
					// 	this.loginParams = {
					// 	  username:"F0004",
					// 	  password:"123456"
					// 	}		
					//     this.onMyLogin()
					// } else {

					// }
					if (this.domainid || this.oldDomainid)  {
						let _domainid = this.domainid? this.domainid : this.oldDomainid //this.oldDomainid? this.oldDomainid : this.domainid//
						this.domainName = _domainid + ".suzi-info.com"
						this.getSaasDomain(this.domainName)
					} else {
					    this.getSaasDomainByXcx()
					}	

			},
			//通过微信UUID获取domain id
			getSaasDomainByXcx() {
				let that = this
				let localHost = this.domainid + ".suzi-info.com"
				uni.setStorageSync(SASS_TENANT_ID,'');
				uni.login({
				    provider: 'weixin',
				    success: function (loginRes) {
						console.log(loginRes)
						//获取到小程序授权码，后台验证
						that.$http.get("/saas/data/getByXcx",{params:{domain:localHost,code:loginRes.code}}).then(res=>{
							console.log("res::Sass Domain Id by xcx>",res)
							if(res.data.success) {
								uni.setStorageSync(SASS_TENANT_ID,res.data.result.domainId);
								that.$tip.toast(res.data.result.domainCode);
								that.onWxLogin()//小程序登入入口
							} else {
								that.$tip.toast('公司信息没获取到，请扫登入码！');
								return;
							}
						})
				    },
				    fail: function (err) {
				        // 登录授权失败
				        // err.code是错误码
						console.log(err.code)
				    }
				});
			},
			
			getSaasDomainByXcx1() {
				let that = this
				let localHost = this.domainid + ".suzi-info.com"
				uni.setStorageSync(SASS_TENANT_ID,'');
				uni.login({
				    provider: 'weixin',
				    success: function (loginRes) {
						console.log(loginRes)
						//获取到小程序授权码，后台验证
						that.$http.get("/saas/data/getByXcx",{params:{domain:localHost,code:loginRes.code}}).then(res=>{
							console.log("res::Sass Domain Id by xcx>",res)
							if(res.data.success) {
								// uni.setStorageSync(SASS_TENANT_ID,res.data.result.domainId);
								that.oldDomainid = res.data.result.domainCode
								that.domainNamecompS = res.data.result.domainName
								uni.setStorageSync(SASS_DOMAIN_NAME,that.domainNamecompS)
							} 
						})
				    },
				    fail: function (err) {
				        // 登录授权失败
				        // err.code是错误码
						console.log(err.code)
				    }
				});
			},
			//用户登入，待域名信息，选定租户。
			onMyLogin() {
				this.loading=true;
				    this.mLogin(this.loginParams).then((res) => {
					  this.loading=false;
				      if(res.data.success){
						 // #ifdef APP-PLUS
						  console.log(res.data)
						  this.saveClientId()
						  // this.getEmployee(code)
						  // this.onWxLogin()
						 // #endif
						 // #ifndef APP-PLUS
						  this.$tip.success('登录成功!')
						  this.$Router.replaceAll({name:'index'})
						 // #endif
						}else{
				          this.$tip.alert(res.data.message);
				        }
				    }).catch((err) => {
				      let msg = err.data.message || "请求出现错误，请稍后再试"
				      this.loading=false;
					  this.$tip.alert(msg);
				    }).finally(()=>{
					  this.loading=false;
				})
			},		
			//3.获取到微信授权码，进入后台验证用户。
			onXcxLogin(code) {		
				this.loginParams = {code:code,domainId:uni.getStorageSync(SASS_TENANT_ID),domainCode:uni.getStorageSync(SASS_DOMAIN_ID),domainName:uni.getStorageSync(SASS_DOMAIN_NAME)}
				this.loading=true;
				    this.xcxLogin(this.loginParams).then((res) => {
					  this.loading=false;
				      if(res.data.success){
						  console.log(res.data)
						  // this.getEmployee(code)
						  this.$tip.success('登录成功!')
						  this.$Router.replaceAll({name:'index'})
						}else{
				          this.$tip.alert(res.data.message || "登入失败！");
				        }
				    }).catch((err) => {
						console.log("111111111",err)
				       let msg = ((err.response || {}).data || {}).message || "1请求出现错误，请稍后再试"
				      this.loading=false;
					 
					  if (err.data && err.data.message && err.data.message.includes('微信ID没关联系统用户')) {
						this.loginWay = 2
						this.unionId = err.data.result.unionId
						this.openid = err.data.result.openid
						 this.$tip.toast('用户不存在,请通过手机号注册!');
					  } else {
						 this.$tip.toast(msg);
					  }

				    }).finally(()=>{
					  this.loading=false;
				})
			},	
			//2.获取微信授权码，然后进入小程序登入。
			onWxLogin(){
				let that = this
				console.log("wx login ...")
				uni.login({
				    provider: 'weixin',
				    success: function (loginRes) {
						console.log(loginRes)
						//获取到小程序授权码，后台验证
						that.onXcxLogin(loginRes.code)
						// 登录成功，微信用户信息
						//     uni.getUserInfo({
						//         provider: 'weixin',
						//         success: function(info) {
						//             // 获取用户信息成功, info.authResult保存用户信息
									// console.log(info)
						//         }
						//     })
				    },
				    fail: function (err) {
				        // 登录授权失败
				        // err.code是错误码
						console.log(err.code)
				    }
				});
				
			},
			saveClientId(){
				var info = plus.push.getClientInfo();
				var cid = info.clientid;
				this.$http.get("/sys/user/saveClientId",{params:{clientId:cid}}).then(res=>{
					console.log("res::saveClientId>",res)
					this.$tip.success('登录成功!')
					this.$Router.replaceAll({name:'index'})
				})
			},
			
			//1.获取域名ID。
			getSaasDomain(localHost) {
				console.log(this.domainName)
				// let hostname = "zhangtest.suzi-info.com"
				// let localHost = this.domainid + ".suzi-info.com"
				uni.setStorageSync(SASS_TENANT_ID,'');
				this.$http.get("/saas/data/get",{params:{domain:localHost}}).then(res=>{
					console.log("res::Sass Domain Id>",res)
					uni.setStorageSync(SASS_TENANT_ID,res.data);
					this.onWxLogin()//小程序登入入口
				})
			},
			getWxDomain(code) {
				this.$http.get("/sys/xcxLogin",{params:{code:code}}).then(res=>{
					console.log("res::xcxLogin auth ...>",res)
				})
			},
			changePassword() {
				this.showPassword = !this.showPassword;
			},
			onSMSSend() {
				let smsParams = {};
				smsParams.mobile=this.phoneNo;
				smsParams.smsmode="0";
				let checkPhone = new RegExp(/^[1]([3-9])[0-9]{9}$/);
                if(!smsParams.mobile || smsParams.mobile.length==0){
					this.$tip.toast('请输入手机号');
					return false
				}
				if(!checkPhone.test(smsParams.mobile)){
					this.$tip.toast('请输入正确的手机号');
					return false
				}
				this.$http.post("/sys/sms",smsParams).then(res=>{
				  if(res.data.success){
					this.smsCountDown = 60;
					this.startSMSTimer();
				  }else{
					this.smsCountDown = 0;
					this.$tip.toast(res.data.message);
				  }
				});
			  },
			startSMSTimer() {
				this.smsCountInterval = setInterval(() => {
				  this.smsCountDown--;
				  if (this.smsCountDown <= 0) {
					clearInterval(this.smsCountInterval);
				  }
				}, 1000);
			},
			onSMSLogin() {
				let checkPhone = new RegExp(/^[1]([3-9])[0-9]{9}$/);
				
				if(!this.phoneNo || this.phoneNo.length==0){
				  this.$tip.toast('请填写手机号');
				  return;
				}
				if(!checkPhone.test(this.phoneNo)){
					this.$tip.toast('请输入正确的手机号');
					return false
				}
				if(!this.smsCode || this.smsCode.length==0){
				  this.$tip.toast('请填短信验证码');
				  return;
				}
				let loginParams = {
				  mobile:this.phoneNo,
				  captcha:this.smsCode,
				  unionId:this.unionId,
				  openid:this.openid,
				};
				this.PhoneLogin(loginParams).then((res) => {
				  console.log("res====》",res)
				  if(res.data.success){
					this.$tip.success('登录成功!')
					this.$Router.replaceAll({name:'index'})
				  }else{
					this.$tip.error(res.data.message);
				  }
				}).catch((err) => {
				  let msg = ((err.response || {}).data || {}).message || err.data.message || "请求出现错误，请稍后再试"
				  this.$tip.error(msg);
				});
			},
			loginSuccess() {
			  // 登陆成功，重定向到主页
			  this.$Router.replace({name:'index'})
			},
			requestFailed(err) {
			  this.$message.warning("登录失败")
			},
        },
		beforeDestroy() {
		    if (this.smsCountInterval) {
		        clearInterval(this.smsCountInterval);
		    }
		},
    }
</script>

<style>
    .login-paddingtop {
        padding-top: 100upx;
    }

    .zai-box {
        padding: 0 20upx;
        padding-top: 100upx;
        position: relative;
    }

    .zai-logo {
        width: 200upx;
        height: 150px;
    }

    .zai-title {
       font-size: 58upx;
       color: #000000;
       text-align: center;
    }

    .input-placeholder, .zai-input {
        color: #94afce;
    }

    .zai-label {
        padding: 60upx 0;
        text-align: center;
        font-size: 30upx;
        color: #a7b6d0;
    }

    .zai-btn {
        background: #ff65a3;
        color: #fff;
        border: 0;
        border-radius: 100upx;
        font-size: 36upx;
    }

    .zai-btn:after {
        border: 0;
    }

    /*按钮点击效果*/
    .zai-btn.button-hover {
        transform: translate(1upx, 1upx);
    }

</style>
